<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<link rel="stylesheet" href="${ctx}/res/js/thirdParty/zTree_v3/css/zTreeStyle/zTreeStyle.css" type="text/css">
<script type="text/javascript" src="${ctx}/res/js/thirdParty/zTree_v3/js/jquery.ztree.core-3.5.js"></script>
<script type="text/javascript"
	src="${ctx}/res/js/thirdParty/MD5/jQuery.md5.js"></script>
<script type="text/javascript"
	src="${ctx}/res/js/userManagement/addOrUpdateUser.js"></script>
	<style type="text/css">
		.menuContent {
			border:1px solid black;
			display:none;
			background-color:white;
			width:313px;
			height:300px;
			position:absolute;
			z-index:9999;
			overflow:auto;
		}
		option {
			height: 32px;
			line-height:32px;
			font-size:14px;
			
		}
		option:hover {
			background-color:#4499EE;
		}
		option:selected {
			background-color:#3265e8;
		}
	</style>
</head>
<body>
	<input type="hidden" id="hiddenUsername" value="${user.username}" />
	<div id="pageName" class="pageName"></div>
	<div id="form_data" class="form_data">
	<input type="hidden" id="dept_id" value="${user.dept_id }"/>
		<form id="userForm">		 
			<center>
			<!-- 显示用户信息 -->
			<table>
				<!-- 显示用户名、状态 -->
				<tr>
					<td class="td_for_label">USER.USERNAME<span style="color:red">&nbsp;*</span></td>
					
					<td class="td_for_input">
						<input type="text" id="username"  name="username" value="${user.username}">
					</td>
					
				 	<td class="td_for_label">USER.USER_STATUS<span style="color:red">&nbsp;*</span> </td>
					<td >
						<select id="user_status" name="user_status" 
							style="width: 316px; height: 32px;line-height:32px;font-size:14px;padding: 4px 6px;" >
							<option>----请选择状态----</option>
								<option value="0" 
									<c:if test="${user.user_status!= null &&  user.user_status==0}">
									selected
									</c:if> 
								>未使用</option>
								<option value="1"
									<c:if test="${user.user_status!= null &&  user.user_status==1}">
									selected
									</c:if>
								>使用中</option>
								<option value="2"
									<c:if test="${user.user_status!= null &&  user.user_status==2}">
									selected
									</c:if>
								>冻结</option>
						</select>
					</td>
				</tr>
				
				<!-- 显示密码、部门名 -->
				<tr>
					<td class="td_for_label">USER.PASSWORD<span style="color:red">&nbsp;*</span> </td>
					<td class="td_for_input">
						<input type="password" id="password" name="password" value="${user.password}">
					</td>
					
					<td class="td_for_label" >USER.DEPT_NAME<span>&nbsp;&nbsp;&nbsp;</span></td>
					<td class="td_for_input">
						<c:choose>
							<c:when test="${user.dept_name != null }"> 
						   		<input id="dept_name" type="text" readonly name="dept_id" value="${user.dept_name }"  onclick="showMenu(); return false;"/>
						   </c:when> 
						   <c:otherwise>
						   		<input id="dept_name" type="text" readonly name="dept_id" value="----请选择部门----"  onclick="showMenu(); return false;"/>
						   </c:otherwise>  
						</c:choose>
						<!-- 显示部门树 -->
						<div id="menuContent" class="menuContent" >
							<ul id="departmentTree" class="ztree" style="margin-top:0;width:310px;"></ul>
						</div>
					</td>
				</tr>
				
				<!-- 显示用户中文名、角色 -->
				<tr>
					<td class="td_for_label">USER.CN_NAME<span style="color:red">&nbsp;*</span> </td>
					<td class="td_for_input">
						<input type="text" id="cn_name" name="cn_name" value="${user.cn_name }">
					</td>
						
					<td class="td_for_label" >USER.ROLE_NAME<span>&nbsp;&nbsp;&nbsp;</span></td>
					<td rowspan="3" > 
						<div>
							<div  style="float:left;">
								<select multiple id="select1" style="width: 108px; height: 130px;">
										<c:forEach items="${roleList}" var="x">
											<option value="${x.role_name}">${x.role_name}</option>
										</c:forEach>
								</select>
							</div>
							<div style="float:left;">
								<div style="margin:0 5px" id="add" class="toolButton" >选中添加</div><br>
								<div style="margin:5px" id="add_all" class="toolButton">全部添加</div><br>
								<div style="margin:0 5px" id="remove" class="toolButton">选中移除</div><br>
								<div style="margin:5px" id="remove_all" class="toolButton">全部移除</div>
							</div>
							<div style="float:left;">
								<select multiple id="select2" name="role_name" style="width: 108px; height: 130px;">
									<c:forEach items="${roleArray}" var="x" >
										<option value="${x}">${x}</option>
									</c:forEach> 	
								</select>
							</div>
						</div>
					</td>
				</tr>
				
				<!-- 显示用户邮箱 -->
				<tr>
					<td class="td_for_label">USER.EMAIL<span style="color:red">&nbsp;*</span> </td>
					<td class="td_for_input"><input type="text" id="email" name="email" 
						value="${user.email }">
					</td>
				</tr>
				
				<!-- 显示用户号码 -->
				<tr>
					<td class="td_for_label">USER.EMP_CODE<span style="color:red">&nbsp;*</span> </td>
					<td class="td_for_input"><input type="text" id="emp_code" name="emp_code" 
						value="${user.emp_code }">
					</td>
				</tr>
				
				<!-- 按键显示 -->
				<tr>
					<td style="text-align:center;padding:10px;" colspan="4">
						<div id="btnSubmit" class="toolButton">提交</div>
						<div id="btnCancel" class="toolButton">取消</div>
					</td>
				</tr>
			</table>
			</center>
		</form>
		<form id="submitcurrentpage" method="post" action="${ctx}/userManagement/userList.do">
			<input type="hidden" name="pageType" value="lastest" />
		</form>
	</div>
</body>
</html>